<!-- 库存报表->收发存汇总表 -->
<template>
    <div class="content-wrapper a-base-container">
        <div class="requisition-set-wrapper">
            <div ref="print" class="credentials-wrapper" id="documents-wrapper">
                <div style="min-height:400px;">
                    <h3 class="text-center">
                        <span class="text-name">收发存汇总表</span><br>
                    </h3>
                    <div style="display:flex;width:220px;margin:0 auto;">
                        <div style="flex: 0 0 50px;">期间：</div>
                        <div style="display:flex;flex:0 0 300px;" v-if="startPeriodShow">
                            <div style="flex: 0 0 80px;text-align:center">{{startPeriodShow}}</div> 至 <div style="flex: 0 0 80px;text-align:center">{{endPeriodShow}}</div>
                        </div>
                        <div style="display:flex;flex:0 0 300px;" v-else-if="periodData.length > 0">
                            <div style="flex: 0 0 80px;text-align:center">{{periodData[0].currentYear}}-{{periodData[0].currentPeriod}} </div> 至 <div style="flex: 0 0 80px;text-align:center">{{periodData[periodData.length - 1].currentYear}}-{{periodData[periodData.length - 1].currentPeriod}}</div>
                        </div>
                    </div>
                    <!-- 按钮 -->
                    <div class="btn-wrapper clearfix" style="border:none;">
                        <a-row class="text-center clearfix">
                            <a-col :xs="24" :sm="24" :md="24" :lg="16" :xl="12">
                                <a-col :xs="btn_grid.xs" :sm="btn_grid.sm" :md="btn_grid.md" :lg="btn_grid.lg" :xl="btn_grid.xl">
                                    <div class="btns" @click="searchDynamic">
                                        <a-icon class="btns-icon" type="search" />
                                        <div class="btns-text">查询</div>
                                    </div>
                                </a-col>
                                <!-- <a-col :xs="btn_grid.xs" :sm="btn_grid.sm" :md="btn_grid.md" :lg="btn_grid.lg" :xl="btn_grid.xl">
                                    <div class="btns" @click="syncFun">
                                        <a-icon class="btns-icon" type="sync" />
                                        <div class="btns-text">刷新</div>
                                    </div>
                                </a-col> -->
                            </a-col>
                            <a-col :xs="24" :sm="24" :md="24" :lg="16" :xl="12">
                                <!-- <a-col :xs="btn_grid.xs" :sm="btn_grid.sm" :md="btn_grid.md" :lg="btn_grid.lg" :xl="btn_grid.xl">
                                    <div class="btns" @click="printOrder">
                                        <a-icon class="btns-icon" type="printer" />
                                        <div class="btns-text">打印</div>
                                    </div>
                                </a-col> -->
                                <a-col :offset="22" :xs="btn_grid.xs" :sm="btn_grid.sm" :md="btn_grid.md" :lg="btn_grid.lg" :xl="btn_grid.xl">
                                    <div class="btns" @click="exportOrder">
                                        <a-icon class="btns-icon" type="export" />
                                        <div class="btns-text">导出</div>
                                    </div>
                                </a-col>
                            </a-col>
                        </a-row>
                    </div>
                    <section>
                        <a-row>
                            <a-col :span="24">
                                <div class="table-box">
                                    <a-table id="bills_tb" :columns="columns" :data-source="dataSource" :pagination="pagination" :rowClassName="rowClassName" @expand="expand" :expandedRowKeys="tableExplandKey" :size="small" :scroll="{x:600,y:550}" bordered>
                                        <template slot="inTotalQuantity" slot-scope="text,record">
                                            <div>{{text | NumFormat}}</div>
                                        </template>
                                        <template slot="outTotalQuantity" slot-scope="text,record">
                                            <div>{{text | NumFormat}}</div>
                                        </template>
                                        <template slot="startTotalQuantity" slot-scope="text,record">
                                            <div>{{text | NumFormat}}</div>
                                        </template>
                                        <template slot="endTotalQuantity" slot-scope="text,record">
                                            <div>{{text | NumFormat}}</div>
                                        </template>
                                    </a-table>
                                </div>
                            </a-col>
                        </a-row>
                        <div class="edit-mask" v-show="editMask">
                            <!-- 遮罩（点击修改关闭遮罩） -->
                        </div>
                    </section>
                </div>
            </div>
        </div>

        <!--加载中-->
        <div class="loading-wrapper" v-show="loading">
            <a-spin class="loading-content" tip="加载中..." />
        </div>
        <!--用做横向打印-->
        <!-- <div v-html="stylePrint"></div> -->
        <print-modal ref="printDom" v-if="printVisible" :incomingPrintData="incomingPrintData" @cancelPrint="cancelPrint"></print-modal>

        <!--查询弹窗-->
        <search-wrapper-not-plan ref="searchWrapperRef" @newPlan="getMyselfPlan" @changePlane="changePlane" :type="searchType" @searchPlan="searchPlan">
            <template slot="searchConditions">
                <a-col :span="12">
                    <div class="date-radio-box">
                        <div>出入库日期/期间：</div>
                        <a-radio-group v-model="radioValue" @change="onChangeRadio">
                            <a-radio style="display: block;" :value="1">
                                <div class="filter" style="display:block;float:right;">
                                    <label class="filter-label">日期：</label>
                                    <div class="filter-control">
                                        <a-date-picker format="YYYY-MM-DD" :disabled="radioValue != 1" v-model="voucherDateStart" @change="onChangeDateStart" /> 至
                                        <a-date-picker format="YYYY-MM-DD" :disabled="radioValue != 1" v-model="voucherDateEnd" @change="onChangeDateEnd" />
                                        <!-- <a-range-picker :disabled="radioValue != 1" v-model="voucherDate" :ranges="{ '今日': [moment(), moment()], '本月': [moment(), moment().endOf('month')] }" @change="onChangeDate" /> -->
                                    </div>
                                </div>
                            </a-radio>
                            <a-radio style="display: block" :value="2">
                                <div class="filter" style="display:block;float:right;">
                                    <label class="filter-label">期间：</label>
                                    <div class="filter-control">
                                        <a-select placeholder="开始期间" :disabled="radioValue != 2" v-model="startPeriodShow" style="width:165px" @change="startPeriodChange">
                                            <a-select-option v-for="item in periodData" :key="item" :data-id="item.id" :value="`${item.currentYear}-${item.currentPeriod}`">
                                                {{item.currentYear}}-{{item.currentPeriod}}
                                            </a-select-option>
                                        </a-select>
                                        至
                                        <a-select placeholder="结束期间" :disabled="radioValue != 2" v-model="endPeriodShow" style="width:165px" @change="endPeriodChange">
                                            <a-select-option v-for="item in periodData" :key="item" :data-id="item.id" :value="`${item.currentYear}-${item.currentPeriod}`">
                                                {{item.currentYear}}-{{item.currentPeriod}}
                                            </a-select-option>
                                        </a-select>
                                    </div>
                                </div>
                            </a-radio>
                        </a-radio-group>
                    </div>
                </a-col>
                <a-col :span="12">
                    <div class="filter">
                        <label class="filter-label">仓库：</label>
                        <div class="filter-control">
                            <div style="background:rgba(0,0,0,0);width:100%;height:28px;z-index:2;position:absolute;top:10px;left:0;" @click="handleSearch('warehouseNameRef')"></div>
                            <a-input-search placeholder="请选择仓库" v-model="warehouseName" size="small" @search="handleSearch('warehouseNameRef')" />

                            <form-search-group ref="warehouseNameRef" :dynamicData="{name:'仓库',val:'warehouse',code:'warehouseId',value:warehouseName}" @clickItem="setValue"></form-search-group>
                        </div>
                    </div>
                </a-col>
                <!-- <a-col :span="12">
                    <div class="filter">
                        <label class="filter-label">期间：</label>
                        <div class="filter-control">
                            <a-range-picker v-model="periodDate" format="YYYY-MM" :placeholder="['开始期间', '结束期间']" @change="onPeriodDate" />
                        </div>
                    </div>
                </a-col>
                <a-col :span="12">
                    <div class="filter">
                        <label class="filter-label">单据日期：</label>
                        <div class="filter-control">
                            <a-range-picker v-model="voucherDate" :ranges="{ '今日': [moment(), moment()], '本月': [moment(), moment().endOf('month')] }" @change="onChangeDate" />
                        </div>
                    </div>
                </a-col> -->
                <a-col :span="12">
                    <div class="filter">
                        <label class="filter-label">业务类型：</label>
                        <div class="filter-control">
                            <a-select mode="multiple" placeholder="请选择业务类型" style="width: 100%" v-model="businessTypes" @change="handleChangeBusiness">
                                <a-select-option v-for="(item,index) in businessTypesArray" :key="index" :value="item.code + ''">
                                    {{item.name}}
                                </a-select-option>
                            </a-select>
                        </div>
                    </div>
                </a-col>
                <a-col :span="12">
                    <div class="filter">
                        <label class="filter-label">单据类型：</label>
                        <div class="filter-control">
                            <a-select mode="multiple" placeholder="请选择单据类型" style="width: 100%" v-model="dataSources" @change="handleChangeDataSources">
                                <a-select-option v-for="(item,index) in dataSourcesArray" :key="index" :value="item.code + ''">
                                    {{item.name}}
                                </a-select-option>
                            </a-select>
                        </div>
                    </div>
                </a-col>

                <a-col :span="12">
                    <div class="filter">
                        <label class="filter-label">物料分类：</label>
                        <div class="filter-control" ref="inventoryTypeWarpper" id="inventoryTypeId">
                            <a-input size="small" onfocus="this.select()" :style="{'position':'relative','z-index':zIndexType}" v-model="inventoryTypeNameArray" @pressEnter="handleEnter(2)" @change="handleNameChange()" @click="handlInputArchives(4,'inventoryTypeWarpper')" />
                            <search-archives-type v-if="maskArchivesType" ref="searchArchivesRefType" :inventoryDomTop="inventoryDomTop" :inputType="inputType" :inputVal="inputVal" @closeArchives="closeArchives" @check="checkArchives"></search-archives-type>
                            <div class="mask-archives-type" v-show="maskArchivesType" @click="handlCloseArchives"></div>
                        </div>
                    </div>
                </a-col>
                <a-col :span="12">
                    <div class="filter">
                        <label class="filter-label">物料编码：</label>
                        <div class="filter-control" ref="inventoryCodeWarpper" id="inventoryCodeId">
                            <a-input-group size="small">
                                <a-row :gutter="8">
                                    <a-col :span="10">
                                        <a-input style="position:relative;z-index:3" size="small" v-model="beginCode" onkeyup="value=value.replace(/[^\d]/g,'')" @pressEnter="handleEnter(1)" @change="handleArchiveChange()" @click="handlInputArchives(1,'inventoryCodeWarpper')" />
                                    </a-col>
                                    <a-col :span="4" class="text-center">至</a-col>
                                    <a-col :span="10">
                                        <a-input style="position:relative;z-index:3" size="small" v-model="endCode" onkeyup="value=value.replace(/[^\d]/g,'')" @pressEnter="handleEnter(1)" @change="handleArchiveChange()" @click="handlInputArchives(2,'inventoryCodeWarpper')" />
                                    </a-col>
                                </a-row>
                            </a-input-group>
                            <searchArchives v-if="maskArchives" ref="searchArchivesRef" :inventoryDomTop="inventoryDomTop" :inputType="inputType" :inputVal="inputVal" @closeArchives="closeArchives" @check="checkArchives"></searchArchives>
                            <div class="mask-archives" v-show="maskArchives" @click="handlCloseArchives"></div>
                        </div>
                    </div>
                </a-col>
                <a-col :span="12">
                    <div class="filter">
                        <label class="filter-label">物料名称：</label>
                        <div class="filter-control" ref="inventoryNameWarpper" id="inventoryNameId">
                            <a-input size="small" :style="{'position':'relative','z-index':zIndex}" v-model="inventoryName" @pressEnter="handleEnter(2)" @change="handleNameChange()" @click="handlInputArchives(3,'inventoryNameWarpper')" />
                            <searchArchivesName v-if="maskArchivesName" ref="searchArchivesRefName" :inventoryDomTop="inventoryDomTop" :inputType="inputType" :inputVal="inputVal" @closeArchives="closeArchives" @check="checkArchives"></searchArchivesName>
                            <div class="mask-archives-name" v-show="maskArchivesName" @click="handlCloseArchives"></div>
                        </div>
                    </div>
                </a-col>
                <a-col :span="12">
                    <div class="filter">
                        <label class="filter-label">规格型号：</label>
                        <div class="filter-control">
                            <a-input size="small" v-model="inventorySpecification" />
                        </div>
                    </div>
                </a-col>
            </template>
        </search-wrapper-not-plan>
    </div>
</template>
<script>

import { searchWrapperNotPlan } from '@/components/SearchWrapper/';
import { postAction, exportPostAction } from "@/api/manage";
import moment from "moment";
import { list as ListPeriod } from "@/api/erp/period";//获取会计期间
import { Controlwidth } from "@/utils/antTableComponents";
import FormSearchGroup from '@/components/Form/FormSearchGroup';

import searchArchives from '@/components/OrderDynamicForm/searchArchives'
import searchArchivesName from '@/components/OrderDynamicForm/searchArchivesName'
import searchArchivesType from '@/components/OrderDynamicForm/searchArchivesType'

export default {
    components: {
        FormSearchGroup,        //搜索选择
        searchArchives,         //物料
        searchArchivesName,     //物料名称
        searchArchivesType,
        searchWrapperNotPlan,     //物料分类
    },
    data () {
        return {
            //----------↓样式----------
            btn_grid: {
                xs: 2,
                sm: 2,
                md: 2,
                lg: 2,
                xl: 2
            },
            //----------↑样式----------

            columns: [
                //     {
                //     title: '仓库编码',
                //     dataIndex: 'warehouseCode',
                //     width: 200,
                //     align: 'center',
                // }, 
                {
                    title: '仓库',
                    dataIndex: 'warehouseName',
                    width: 200,
                    align: 'left',
                }, {
                    title: '物料编码',
                    dataIndex: 'inventoryCode',
                    align: 'left',
                }, {
                    title: '物料名称',
                    dataIndex: 'inventoryName',
                    align: 'left',
                }, {
                    title: '规格型号',
                    dataIndex: 'inventorySpecification',
                    align: 'left',
                }, {
                    title: '计量单位',
                    dataIndex: 'baseUnitName',
                    align: 'left',
                }, {
                    title: '期初结存',
                    dataIndex: 'startTotalQuantity',
                    align: 'right',
                    scopedSlots: {
                        customRender: 'startTotalQuantity'
                    }
                }, {
                    title: '本期入库数量',
                    dataIndex: 'inTotalQuantity',
                    align: 'right',
                    scopedSlots: {
                        customRender: 'inTotalQuantity'
                    }
                }, {
                    title: '本期出库数量',
                    dataIndex: 'outTotalQuantity',
                    align: 'right',
                    scopedSlots: {
                        customRender: 'outTotalQuantity'
                    }
                }, {
                    title: '期末结存',
                    dataIndex: 'endTotalQuantity',
                    align: 'right',
                    scopedSlots: {
                        customRender: 'endTotalQuantity'
                    }
                }],
            dataSources: [], // 单据类型
            dataSourcesArray: [
                { name: '库存期初', code: 'PeriodStartOfStock' },
                { name: '采购入库', code: 'PurchaseReceiveVoucher' },
                { name: '产成品入库', code: 'ProductReceiveVoucher' },
                { name: '委外入库', code: 'DelegateReceiveVoucher' },
                { name: '其他入库', code: 'OtherReceiveVoucher' },
                { name: '销售出库', code: 'SaleDispatchVoucher' },
                { name: '材料出库', code: 'MaterialDispatchVoucher' },
                { name: '委外出库', code: 'DelegateDispatchVoucher' },
                { name: '其他出库', code: 'OtherDispatchVoucher' },
            ],
            businessTypes: [], // 业务类型                                
            businessTypesArray: [
                { name: '普通采购', code: 1 },
                { name: '固定资产', code: 2 },
                { name: '普通销售', code: 3 },
                { name: '领料', code: 4 },
                { name: '退料', code: 5 },
                { name: '补料', code: 6 },
                { name: '生成完工', code: 9 },
                { name: '产品退库', code: 94 },
                { name: '委外产品退库', code: 95 },
                { name: '销售退货', code: 98 },
                { name: '采购退货', code: 99 },
                { name: '库存期初', code: 100 },
            ],
            pagination: {
                size: "small",
                defaultPageSize: 200,
                current: 1,
                pageSize: 200,
                total: 0,
                showTotal: total => {
                    return (
                        <div>
                            共 {total} 条数据，每页
                            <a-input style="height:22px !important;width:3.2rem;"
                                value={this.pagination.pageSize}
                                min={1}
                                max={200}
                                size="small"
                                step={1}
                                onPressEnter={e => this.changePageSize(e)}
                            />
                            条
                        </div>
                    );
                },
                onChange: (page, pageSize) => {
                    this.pagination.current = page;
                    this.getList();
                },
            },
            dataSource: [],
            setTime: null,  //延迟请求
            tableExplandKey: [],//默认展开的行

            //物料
            warehouseName: null,//仓库
            warehouseId: [],
            maskArchives: false,
            maskArchivesName: false,
            maskArchivesType: false,
            zIndex: 5,
            zIndexType: 5,
            inputType: null,
            beginCode: null,
            endCode: null,
            inventoryName: null,
            inventorySpecification: null,
            inventoryType: null,
            inventoryTypeNameArray: [],
            inventoryTypeIdArray: [],
            radioValue: 1,//单选日期还是期间
            periodData: [],
            periodDate: null,//期间
            startPeriod: null,//期间开始
            endPeriod: null,//期间结束
            startPeriodShow: null,
            endPeriodShow: null,
            currentPeriodStart: 0,
            currentPeriodEnd: 0,
            voucherDate: null,//单据日期
            voucherDateStart: null,//单据开始日期
            voucherDateEnd: null,//单据结束日期
            postData: {}
        };
    },
    updated () {
        Controlwidth("bills_tb", 50);
    },
    created () {
        // this.getList();
        this.getPeriod();
    },
    activated () {
        this.getList();
    },
    methods: {
        moment,
        //导出
        exportOrder () {
            exportPostAction('/inOut/recordMain/summaryExportData', this.postData).then(response => {
                let url = window.URL.createObjectURL(
                    new Blob([response], { type: "application/vnd.ms-excel" })
                );
                let link = document.createElement("a");
                link.style.display = "none";
                link.href = url;
                link.setAttribute("download", "收发存汇总.xls");
                document.body.appendChild(link);
                link.click();
            }).catch(error => { });
        },
        printOrder () {
            //打印
            this.$print(this.$refs.print);
        },
        //动态查询搜索条件
        searchDynamic () {
            this.$refs.searchWrapperRef.showModel();
        },
        searchGroup (t) {
            if (t == 1) {
                this.$refs.credentialsSearch.showModal();
            } else {
                //延迟请求
                if (this.setTime) {
                    clearTimeout(this.setTime)
                }
                this.setTime = setTimeout(() => {
                    this.$refs.credentialsSearch.inputSearch();
                }, 500)
            }
        },
        setValue (data) {
            this.name = data.name;
        },
        handleChangeBusiness (e, v) {
            this.businessTypes = e;
        },
        handleChangeDataSources (e, v) {
            this.dataSources = e;
        },
        onChangeDate (dates, dateStrings) {
            //单据日期
            console.log('From: ', dates[0], ', to: ', dates[1]);
            console.log('From: ', dateStrings[0], ', to: ', dateStrings[1]);
            console.log(dateStrings);
            this.voucherDate = dateStrings;
            this.voucherDateStart = dateStrings[0];
            this.voucherDateEnd = dateStrings[1];
        },
        onChangeDateStart (value, mode) {
            console.log(value, mode)
            this.voucherDateStart = mode;
        },
        onChangeDateEnd (value, mode) {
            console.log(value, mode)
            this.voucherDateEnd = mode;
            this.compareTime(this.voucherDateStart, this.voucherDateEnd)
        },
        compareTime (start, end) {
            //比较日期大小
            let oDate1 = new Date(start);
            let oDate2 = new Date(end);
            if (oDate1.getTime() > oDate2.getTime()) {
                this.voucherDateStart = this.voucherDateEnd;
            }
        },
        onPeriodDate (dates, dateStrings) {
            //期间
            console.log('From: ', dates[0], ', to: ', dates[1]);
            console.log('From: ', dateStrings[0], ', to: ', dateStrings[1]);
            console.log(dateStrings);
            this.periodDate = dateStrings;
            this.startPeriod = dateStrings[0].slice(0, 7);
            this.endPeriod = dateStrings[1].slice(0, 7);
        },
        //获取列表
        getList () {
            // this.tableExplandKey = Array.from(new Set(this.tableExplandKey)); // 利用Array.from将Set结构转换成数组
            this.tableExplandKey = []; // 利用Array.from将Set结构转换成数组

            const { businessTypes, dataSources } = this;
            this.postData = {
                page: {
                    current: this.pagination.current,
                    size: this.pagination.pageSize,
                },
                inventoryClassIds: this.inventoryTypeIdArray.join(','),//物料分类ids
                inventoryCodeEnd: this.endCode,
                inventoryCodeStart: this.beginCode,
                inventoryName: this.inventoryName,
                inventorySpecification: this.inventorySpecification,
                warehouseIds: this.warehouseId,
                // voucherDateStart: this.voucherDateStart,
                // voucherDateEnd: this.voucherDateEnd,
                inOutDateStart: this.voucherDateStart,  //出入库日期开始
                inOutDateEnd: this.voucherDateEnd,      //出入库日期结束
                startPeriod: this.startPeriod,
                endPeriod: this.endPeriod,
                businessTypes,
                dataSources
            }
            postAction('/inOut/recordMain/statisticInOutRecordSDParentSummaryVo', this.postData).then(response => {
                if (response.code === 200) {
                    if (response.data && response.data.warehouseList != null && response.data.inventoryPage != null) {
                        let fatherDate = response.data.warehouseList;
                        let childrenData = response.data.inventoryPage.records;
                       this.tableExplandKey = [];
                        fatherDate.forEach(father => {
                            father.children = [];
                            father.key = father.warehouseId + "";
                            this.tableExplandKey.push(father.key)
                            childrenData.forEach(child => {
                                child.key = child.warehouseId;
                                if (child.inTotalAmount != 0 && child.inTotalQuantity != 0) {
                                    child.inTotalPrice = (Number(child.inTotalAmount) / Number(child.inTotalQuantity)).toFixed(2);
                                } else {
                                    child.inTotalPrice = 0;
                                }

                                if (child.outTotalAmount != 0 && child.outTotalQuantity != 0) {
                                    child.outTotalPrice = (Number(child.outTotalAmount) / Number(child.outTotalQuantity)).toFixed(2);
                                } else {
                                    child.outTotalPrice = 0;
                                }
                                if (father.warehouseId == child.warehouseId) {
                                    father.children.push(child);
                                }
                            });
                        });
                        this.dataSource = fatherDate;
                         this.pagination.total = response.data.inventoryPage.total;
                        console.log('展开列：', this.tableExplandKey)
                    } else {
                        this.dataSource = [];
                    }
                    console.log(this.dataSource);
                }
            }).catch(error => { });
        },
        //改变分页大小
        changePageSize (e) {
            const value = e.target.value;
            let size = Number.parseInt(value);
            if (!size) {
                size = 20;
            }
            if (size > 500) {
                size = 500;
            }
            Object.assign(this.pagination, {
                current: 1,
                pageSize: size,
            });

            this.getList();
        },
        handleSearch (n) {
            this.$refs[`${n}`].showModal();
        },
        setValue (data) {
            console.log(data)
            if (data.codesName == 'warehouseId' && data.id) {
                //仓库
                this.warehouseName = data.name;
                this.warehouseId[0] = data.id;
            } else {
                this.warehouseName = "";
                this.warehouseId = [];
            }
        },
        handlInputArchives (type, ref) {

            document.getElementsByClassName('ant-modal-content')[0].style.transform = 'none';

            this.inputType = type;
            if (type == 1 || type == 2) {
                this.maskArchives = true;
                this.zIndex = 1;
                this.zIndexType = 1;
            } else if (type == 3) {
                this.zIndex = 5;
                this.zIndexType = 1;
                this.maskArchivesName = true;
            } else if (type == 4) {
                this.zIndexType = 6;
                this.zIndex = 1;
                this.maskArchivesType = true;
            }
            //获取位置
            console.log(this.$refs[`${ref}`].parentNode.offsetTop);
            let loc = this.$refs[`${ref}`].getBoundingClientRect();
            this.inventoryDomTop = Math.abs(loc.top);
        },
        handleNameChange () {
            //物料名称搜索
            if (this.inventoryName) {
                this.$refs.searchArchivesRefName.inputVal = this.inventoryName;
                this.$refs.searchArchivesRefName.getData(1);
            }
        },
        handleArchiveChange () {
            //物料编码搜索
            console.log(this.inputType)
            if (this.inputType == 1) {
                this.inputVal = this.beginCode;
            } else {
                this.inputVal = this.endCode;
            }
            this.$refs.searchArchivesRef.inputVal = this.inputVal;
            this.$refs.searchArchivesRef.getData(1);
        },
        handleEnter (t) {
            if (t == 1) {
                this.$refs.searchArchivesRef.handleEnter();
            } else {
                this.$refs.searchArchivesRefName.handleEnter();
            }
        },
        closeArchives () {
            this.maskArchives = false;
            this.maskArchivesName = false;
            this.maskArchivesType = false;
        },
        //关闭物料档案弹窗
        handlCloseArchives () {
            document.getElementsByClassName('ant-modal-content')[0].style.transform = 'translate(0px, 0px)';

            if (this.inputType == 1 || this.inputType == 2) {
                this.maskArchives = false;
                this.$refs.searchArchivesRef.closeModel();
            } else if (this.inputType == 3) {
                this.maskArchivesName = false;
                this.$refs.searchArchivesRefName.closeModel();
            } else if (this.inputType == 4) {
                this.maskArchivesType = false;
                this.$refs.searchArchivesRefType.closeModel();
            }
        },
        //物料选择范围-----------------------------------
        checkArchives (data) {
            this.maskArchives = false;
            this.maskArchivesName = false;
            //返回值处理
            if (data[1] == 1) {
                //起始值
                this.beginCode = data[0][0].inventoryCode;
            }
            if (data[1] == 2) {
                //起始值
                this.endCode = data[0][0].inventoryCode;
            }
            if (data[1] == 3) {
                //物料编码名称
                this.inventoryName = data[0][0].inventoryName;
            }
            if (data[1] == 4) {
                //物料分类
                console.log(data[0]);
                let tData = data[0].checkedNodes;
                let typeNameArray = [];
                let typeIdArray = [];
                tData.forEach(item => {
                    typeNameArray.push(item.data.class);
                    typeIdArray.push(item.data.props.id);
                });

                this.inventoryTypeNameArray = typeNameArray.join(';')
                this.inventoryTypeIdArray = typeIdArray;
            }

            this.closeArchives();
        },
        rowClassName (record, index) {
            return !record.inventoryName ? 'changeColorClass' : '';
        },
        searchPlan () {
            if (this.radioValue == 2) {
                //期间
                if (this.currentPeriodStart > this.currentPeriodEnd) {
                    this.$message.warning('开始期间必须小于结束期间');
                    return;
                }
            }
            this.pagination.current = 1;
            this.getList();
            this.$refs.searchWrapperRef.cancel();//关闭弹窗
        },
        syncFun () {
            //刷新
            this.getList();
        },
        getPeriod () {
            //获取会计期间
            ListPeriod().then(response => {
                if (response.code === 200) {
                    console.log(response.data);
                    this.periodData = response.data[0].erpPeriodList;
                }
            }).catch(error => {
                this.$message.error(error.message);
            });
        },
        startPeriodChange (val, select) {
            this.startPeriod = select.key.id;
            this.currentPeriodStart = select.data.key.currentPeriod;
        },
        endPeriodChange (val, select) {
            this.endPeriod = select.key.id;
            this.currentPeriodEnd = select.data.key.currentPeriod;
        },
        onChangeRadio (val) {
            let text = val.target.value;
            console.log(text)
            if (text == 1) {
                this.startPeriodShow = null;
                this.endPeriodShow = null;
                this.startPeriod = null;
                this.endPeriod = null;
            }

            if (text == 2) {
                this.voucherDate = null;//单据日期
                this.voucherDateStart = null;//单据开始日期
                this.voucherDateEnd = null;//单据结束日期
            }
        },
        expand (expanded, record) {
            //点击展开图标时触发
            let id = record.key;
            if (expanded) {
                this.tableExplandKey.push(id)
            } else {
                this.tableExplandKey.splice(this.tableExplandKey.findIndex(e => e === id), 1);
            }
        }
    }
};
</script>
<style lang="less">
    @import '~@/style/purchase/voucher.less';
    .changeColorClass {
        font-weight: bold;
        background-color: #fffceb;
    }
    .credentials-wrapper {
        padding: 10px;
        height: auto;
        overflow-y: auto;
        font-size: 14px;
        .date-tp {
            margin-bottom: 10px;
            .header-tp {
                text-align: left;
            }
        }
        .footer-tp {
            text-align: center;
            margin-top: 10px;
        }

        .text-name {
            // border-bottom: 2px solid rgba(0, 0, 0, 0.8);
            padding-bottom: 5px;
        }

        .bills-box-header {
            display: flex;
            justify-content: space-around;
            .filter {
                display: table;
                width: 280px;
                margin-bottom: 5px;
                .filter-label {
                    display: table-cell;
                    font-weight: normal;
                    max-width: 160px;
                    line-height: 32px;
                    white-space: nowrap;
                    vertical-align: bottom;
                    text-overflow: ellipsis;
                    overflow: hidden;
                }
                .filter-control {
                    display: table-cell;
                    width: 100%;
                }
            }
        }
    }
    .date-radio-box {
        border: 1px solid #ccc;
        padding: 8px;
        .ant-radio {
            margin-top: 20px;
        }
        span.ant-radio + * {
            padding: 0;
            padding-right: 4px;
        }
    }
</style>